<template>
	<view>
		<view class="list-item">
			<view class="log-list" v-if="joinList.length > 0">共<text class="number">{{joinList.length}}</text>条记录</view>
			<view class="list flex align-center" v-if="joinList.length > 0" v-for="(item,index) in joinList" :key="index">
				
				<view class="username">
					<view class="name">{{item.title}}</view>
					<view class="join-time">参加时间:{{item.createtime_text}}</view>
				</view>
				<view class="join-time flex align-center flex-wrap join-btn">
					<text v-if="item.showDel" @tap="joinDetailope(index,'del')">删除</text>
					<text v-if="item.showSave" @tap="joinDetailope(index,'save')">修改</text>
					<text v-if="item.showDetail" @tap="joinDetailope(index,'detail')">查看详情</text>
					
				</view>
			</view>
			<view v-if="joinList.length == 0" class="join-list-null">
				{{joinListEmpty}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				s_id:0,
				joinList:[],
				joinListEmpty:'',
			}
		},
		onLoad(params){
			if(params.s_id)
			{
				this.s_id = params.s_id;
				this.getJoinList();
			}
		},
		methods: {
			getJoinList(){
				var that = this;
				that.$http.post('statistics/getMyJoinList',{
					s_id:that.s_id,
				}).then(res=>{
					if(res.code == 1)
					{
						that.joinList = res.data.list; 
						that.joinListEmpty = '';
					}else{
						that.joinList = [];
						that.joinListEmpty = res.msg;
					}
				})
			},
			joinDetailope(index,type){
				var that = this;
				var info = that.joinList[index];
				switch(type){
					case 'detail':
						this.$api.navigateTo('/pages/form/statistics/join-detail-show?join_id='+info.join_id);
						break;
					case 'save':
						this.$api.navigateTo('/pages/form/statistics/join-detail-edit?join_id='+info.join_id);
						break;	
					case 'del':
						that.$api.showModal('确认删除','删除后不可恢复',function(res){
							if(res == 'yes'){
								that.delJoinInfo(info.join_id,index);
							}
						})
						break;	
				}
			},
			delJoinInfo(join_id,index){
				var that = this;
				that.$api.loadingMsg('正在删除');
				that.$http.post('statistics/joinStatisticsDelete',{
					join_id
				}).then(res=>{
					that.$api.msg(res.msg);
					if(res.code == 1)
					{
						that.joinList.splice(index,1);
						if(that.joinList.length < 1)
						{
							that.joinListEmpty = '没有参与记录';
						}
					}
				});
			},
		}
	}
</script>

<style lang="scss">
.list-item{
	.log-list{
		height: 80rpx;
		line-height: 100rpx;
		padding-left: 20rpx;
		.number{
			margin: 0 10rpx;
			font-weight: bold;
		}
	}		
	.join-list-null{
		text-align: center;
		padding: 20rpx;
		margin-top: 30rpx;
		font-size: 26rpx;
		color: #666666;
	}
	.list{
		width: 96%;
		height: 120rpx;
		background: #ffffff;
		margin: 20rpx 2%;
		border-bottom: 2rpx solid #eeeeee;
		border-radius: 20rpx;
		.username{
			.name{
				font-size: 30rpx;
				color: #333333;
				padding: 0 20rpx;
				width: 420rpx;
				overflow: hidden;
				height: 60rpx;
				line-height: 60rpx;
				overflow: hidden;
				margin-top: -14rpx;
				padding: 0 20rpx;
			}
			.join-time{
				padding: 0 20rpx;
			}
			
		}
		.join-time{
			font-size: 24rpx;
			color:#999999;
			
			text{
					display: inline-block;
					padding: 5rpx 10rpx;
					font-size: 24rpx;
			}
		}
		.join-btn{
			width: 300rpx;
				flex-direction: row-reverse;
		}
	}
}
</style>
